<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">




<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="static/dist/bootstrap-table.min.css">

<!-- Latest compiled and minified JavaScript -->
<script src="static/dist/bootstrap-table.min.js"></script>

<!-- Latest compiled and minified JavaScript -->
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.12.2/locale/bootstrap-table-zh-CN.min.js"></script>

<!-- 引入样式 -->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">

<style>

</style>

</head>
<body>
  <div id="app">

<el-row :gutter="3">
<el-col :span="3">
  <el-input
    placeholder="请输入企业名称"
    v-model="search_qiyename">
  </el-input>
 </el-col>
<el-col :span="3">
    <el-date-picker
      v-model="search_riqi"
      type="date"
      placeholder="选择日期"
		format="yyyy 年 MM 月 dd 日">
    </el-date-picker>
  </el-col>
<el-col :span="4">
是否招聘:
  <el-radio v-model="search_radio" label="是">是</el-radio>
  <el-radio v-model="search_radio" label="否">否</el-radio>
 <el-radio v-model="search_radio" label="无">无</el-radio>
  </el-col>
<el-col :span="3">
  <el-input
    placeholder="请输入地区"
	suffix-icon="el-icon-location"
    v-model="search_diqu">
  </el-input>
  </el-col>

<el-col :span="3">
  <el-input
    placeholder="请输入标签"
    suffix-icon="el-icon-star-on"
    v-model="search_biaoqian">
  </el-input>
 </el-col>

<el-col :span="4">
<el-button type="primary" icon="el-icon-search" @click="searching">条件筛选</el-button>
<el-button icon="el-icon-delete" @click="rmcondition">清空条件</el-button>
 </el-col>
<el-col :span="4">
<el-button type="primary" @click="addqiye()" icon="el-icon-plus">添加企业</el-button>
  <el-button type="primary" @click="exportall()" icon="el-icon-download">全部导出</el-button>
</el-col>
</el-row>

	<table  id="table1" data-url="/home/querydata" data-search="true">
	</table>
	
	<el-dialog
	v-if="protodialog == '信息详情'"
	  :title="qiyename"
	  :visible.sync="dialogVisible"
	  width="80%"
	  >

		<div v-for="(val,index) in sortobj">
			{{transform(index)}}:
			<el-row :gutter="20" v-for="key in val" type="flex" class="row-bg" justify="center" >
			 <el-col :span="4" style="text-align: right;">{{transform(key)}}</el-col>
			  <el-col :span="10">{{info[key]}}</el-col>
			</el-row>
		</div>
	
		
		<div slot="footer" class="dialog-footer">
		    <el-button @click="downdata(info)">下载</el-button>
		    <el-button type="primary" @click="compiledata(info)">编辑</el-button>
		  </div>
	</el-dialog>
	<el-dialog
		v-if="protodialog == '编辑信息'"
	  :title="qiyename"
	  :visible.sync="dialogVisible"
	  width="80%"
	  > 
	
<el-form label-width="80px">
		<div v-for="(val,index) in sortobj">
			{{transform(index)}}:
 

		  <el-form-item v-for="key in val" :label="transform(key)" :key="key">
		    <el-input v-model="compile[key]"></el-input>
		  </el-form-item>
		</div>
	</el-form>


		<div slot="footer" class="dialog-footer">
		    <el-button type="primary" @click="submit">编辑</el-button>
		  </div>
	</el-dialog>
  </div>
</body>
  <!-- import Vue before Element -->
  <script src="static/dist/vue.js"></script>
  <!-- import JavaScript -->
  <script src="static/dist/element-ui.js"></script>
  <script>
var transform = function (key){
	var res = ""
	switch(key){
		case "qiyename":
			res = "企业名称"
		 	break;
		case "laowu":
		  res = "劳务"
		  break;
		case "jingjirenticheng":
		  res = "经纪人提成"
		  break;
		case "huiyuanfanfei":
		  res = "会员返费"
		  break;
		case "zongfanfei":
		  res = "总返费"
		  break;
		case "fanfeitianshu":
		  res = "返费天数"
		  break;
		case "gongjia":
		  res = "工价"
		  break;
		case "xingbie":
		  res = "性别"
		  break;
		case "gongzhong":
		  res = "工种"
		  break;
		case "zhaopian":
		  res = "照片"
		  break;
		case "byzfyj":
		  res = "毕业证复印件"
		  break;
		case "sfzfyj":
		  res = "身份证复印件"
		  break;
		case "tijian":
		  res = "体检"
		  break;
		case "fanchangguiding":
		  res = "返厂规定"
		  break;
		
		case "yanba":
		  res = "烟疤"
		  break;
		case "wenshen":
		  res = "纹身"
		  break;
		case "xueli":
		  res = "学历"
		  break;
		case "shenfenzheng":
		  res = "身份证"
		  break;
		case "qita":
		  res = "其他"
		  break;
		case "banbie":
		  res = "班别"
		  break;
		case "guimo":
		  res = "规模"
		  break;
		case "diqu":
		  res = "地区"
		  break;
		case "dizhi":
		  res = "地址"
		  break;
		case "zhanzuo":
		  res = "站坐"
		  break;
		case "zhuozhuang":
		  res = "着装"
		  break;
		case "gangwei":
		  res = "岗位"
		  break;
		case "changche":
		  res = "厂车"
		  break;
		case "zhusu":
		  res = "住宿"
		  break;
		case "huoshi":
		  res = "伙食"
		  break;
		case "xinzijiegou":
		  res = "薪资结构"
		  break;
		case "faxinri":
		  res = "发薪日"
		  break;
		case "zonghexinzi":
		  res = "综合薪资"
		  break;
		case "zhushengchan":
		  res = "主生产"
		  break;
		case "biaoqian":
		  res = "标签"
		  break;
		case "nianling":
			  res = "年龄"
			  break;
		case "id":
		  res = "编号"
		  break;
		case "beizhu":
		  res = "备注"
		  break;
		case "jibenqingkuang":
		  res = "基本情况"
		  break;
			case "gongzishuoming":
		  res = "工资说明"
		  break;
			case "shisujiaotong":
		  res = "食宿交通"
		  break;
			case "gongzuohuanjing":
		  res = "工作环境"
		  break;
			case "luyongtiaojian":
		  res = "录用条件"
		  break;
			case "suoxuziliao":
				  res = "所需资料"
				  break;
			case "dingdantiaojian":
		  res = "订单条件"
		  break;

		case "shifouzhaopin":
		  res = "是否招聘"
		  break;
		default:
		  res = "未知字段"+key
		
		}
		
		return res
}

   var app = new  Vue({
      	el: '#app',
      	data: {
		 	dialogVisible: false,
			qiyename:"",
			info:{},
			transform:transform,
			protodialog:"",
			compile:{},
		
			sortobj:{
				"jibenqingkuang":[
				"qiyename",
				"diqu",
				"dizhi",
				"guimo",
				"biaoqian",
				"zhushengchan"
				],
				"gongzishuoming":[
				"zonghexinzi",
				"faxinri",
				"xinzijiegou"
			
				],
				"shisujiaotong":[
				"huoshi",
				"zhusu",
				"changche"
				],
				"gongzuohuanjing":[
				"gangwei",
				"zhuozhuang",
				"zhanzuo",
				"banbie",
				"qita"
				],
				"luyongtiaojian":[
				"shenfenzheng",
				"xueli",
				"wenshen",
				"yanba",
				"fanchangguiding",
				"tijian"
				],
				"suoxuziliao":[
				"sfzfyj",
				"byzfyj",
				"zhaopian"
				],
				"dingdantiaojian":[
				"gongzhong",
				"xingbie",
				"nianling",
				"gongjia",
				"fanfeitianshu",
				"zongfanfei",
				"huiyuanfanfei",
				"jingjirenticheng",
				"laowu",
				"beizhu",
				"shifouzhaopin"
				
				]
				
				
			},
			search_qiyename:"",
			search_diqu:"",
			search_biaoqian:"",
			search_riqi:"",
			search_radio:"是",
		},
		
		methods:{
			exportall(){			
				$.ajax({
					url:"/home/exportdata",
					data:JSON.stringify({data:$('#table1').bootstrapTable("getData")}),
					type:"post",
					datatype:"json",
					success:function(res){
						if (res.success == 0){
							alert("导出成功！")
						}else{
							alert("导出失败！"+res.msg)
						}
					}
					
					
				})
				
			},
			downdata(row){
				
			},
			compiledata(row){
				this.protodialog = "编辑信息"
				this.compile = row
			},
			submit(){
				var self = this
				$.ajax({
					url:"/home/updatedata",
					type:"POST",
					data:this.compile,
					datatype:"json",
					success:function(res){
						self.dialogVisible = false
						$('#table1').bootstrapTable("refresh",{url: "/home/querydata"})
 
					}
				})
			},
			addqiye(){
				window.location.href="/home/edit-index"
			},
			rmcondition(){
					this.search_riqi = ""
					this.search_diqu =""
					this.search_biaoqian =""
					this.search_radio = "无"
					this.search_qiyename = ""
			},
			searching(){

				var _this = this
					$.ajax({
					url:"/home/selectdata",
					type:"POST",
					data:{riqi:_this.search_riqi,diqu:_this.search_diqu,biaoqian:_this.search_biaoqian,shifouzhaopin:_this.search_radio,qiyename:_this.search_qiyename},
					datatype:"json",
					success:function(res){
						
						$('#table1').bootstrapTable("load",res)
 
					}
				})
				
				
			},
		}
    })

$('#table1').bootstrapTable({
    url:"/home/querydata",
 pagination: true,//是否显示分页（*）
    columns: [{
        field: 'qiyename',
        title: '企业名称'
    },{
        field: 'biaoqian',
        title:'标签'
    },{
        field: 'gangwei',
        title: '岗位'
    },{
        field: 'beizhu',
        title: '备注'
    },{
        field: 'zonghexinzi',
        title: '综合薪资'
    },{
        field: 'xingbie',
        title: '性别'
    },{
        field: 'nianling',
        title: '年龄'
    },{
        field: 'fanfeitianshu',
        title: '返费天数'
    },{
        field: 'huiyuanfanfei',
        title: '返费金额'
    },{
        field: 'diqu',
        title: '区域'
    },],
 	onClickRow:function(row,e){
		app.dialogVisible = true
		app.qiyename = row.qiyename
		app.info = row
		app.protodialog = "信息详情"
	}
});

 












  </script>
</html>